<template>
  <div class="row">
    <slot></slot>
  </div>
</template>

<script>
export default {
  name: 'zRow',
  props: {
    gutter: {
      type: String,
      default: '0'
    }
  },
  computed: {
    colItems () {
      return this.$children.filter(item => item.$options.name === 'zCol')
    }
  },
  mounted () {
    this.$children.forEach((item) => {
      item.gutter = this.gutter
    })
  }
}
</script>

<style>
.row {
  display: flex;
}
</style>
